<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html">

    <body>

        <ui:composition template="./../index.xhtml">

            <ui:define name="title">
                Demo Bootstrap and JSF
            </ui:define>

            <ui:define name="sum1">
                <div class="row">
                    <div class="col-md-8">
                        <div class="input-group">
                            <span class="input-group-addon">@</span>
                            <h:inputText value="" class="form-control"  />
                        </div>
                        <div class="container">
                            <div class="row">
                                <div class='col-sm-6'>
                                    <div class="form-group">
                                        <div class='input-group date' id='datetimepicker1'>
                                            <input type='text' class="form-control" />
                                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                                <script type="text/javascript">
                                    $(function () {
                                        $('#datetimepicker1').datetimepicker();
                                    });
                                </script>
                            </div>
                        </div>
                    </div>
                </div>
                <h:outputScript name="slideshow.js" library="js"/>
        <h:outputScript name="jquery.js" library="js"/>
        <h:outputScript name="jquery.easing.1.3.js" library="js"/>
        <h:outputScript name="jquery.min.js" library="js"/>
        <h:outputScript name="bootstrap.min.js" library="js"/>
            </ui:define>

        </ui:composition>

    </body>
</html>
